<style lang="scss" scoped>
.cell {
  color: rgb(37, 137, 255);
  cursor: pointer;
  text-decoration: underline;
  font-weight: bold;
  text-align: center;
}
</style>

<template>
  <div class="app-container">
    <el-row>
      <el-col :span="12" class="card-box">
        <el-card>
          <div slot="header">
            <span><i class="el-icon-cpu"></i> 我要寄样</span>
          </div>
          <div class="el-table el-table--enable-row-hover el-table--medium">
            <table cellspacing="0" style="width: 100%">
              <!-- <thead>
                <tr>
                  <th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
                  <th class="el-table__cell is-leaf"><div class="cell">值</div></th>
                </tr>
              </thead> -->
              <tbody>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/Ceshi')">
                      直播一键寄样
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf">
                    <div class="cell">跳转</div>
                  </td> -->
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/NoteApply')">
                      笔记一键寄样
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/sample')">
                      达人信息
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/live')">
                      通讯录
                    </div>
                  </td>
                  <!--通讯录

 <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.free }}%</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/NoteApply')">
                      笔记合作
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/sampleApply')">
                      样衣申请
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td> -->
                </tr>
              </tbody>
            </table>
          </div>
        </el-card>
      </el-col>

      <el-col :span="12" class="card-box">
        <el-card>
          <div slot="header">
            <span><i class="el-icon-tickets"></i> 我要退样</span>
          </div>
          <div class="el-table el-table--enable-row-hover el-table--medium">
            <table cellspacing="0" style="width: 100%">
              <!-- <thead>
                <tr>
                  <th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
                  <th class="el-table__cell is-leaf"><div class="cell">内存</div></th>
                  <th class="el-table__cell is-leaf"><div class="cell">JVM</div></th>
                </tr>
              </thead> -->
              <tbody>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/ApplyAddress')">
                      样衣退货地址
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.total }}G</div></td>
                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.total }}M</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell" @click="handleGo('/sample/sampleReturn')">
                      退货记录
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.used}}G</div></td>
                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.used}}M</div></td> -->
                </tr>
                <tr>
                  <td class="el-table__cell is-leaf">
                    <div
                      class="cell"
                      @click="handleGo('/sample/AfterSalesOrder')"
                    >
                      无信息售后单
                    </div>
                  </td>
                  <!-- <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.free }}G</div></td>
                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.free }}M</div></td> -->
                </tr>
                <!-- <tr>
                  <td class="el-table__cell is-leaf">
                    <div class="cell">使用率</div>
                  </td>
                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem" :class="{'text-danger': server.mem.usage > 80}">{{ server.mem.usage }}%</div></td>
                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm" :class="{'text-danger': server.jvm.usage > 80}">{{ server.jvm.usage }}%</div></td>
                </tr> -->
              </tbody>
            </table>
          </div>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getServer } from "@/api/monitor/server";

export default {
  name: "Center",
  data() {
    return {
      // 服务器信息
      server: [],
    };
  },
  created() {
    // this.getList();
    // this.openLoading();
  },
  methods: {
    handleGo(path, row) {
      this.$router.push({
        path: path,
      });
    },
    /** 查询服务器信息 */
    getList() {
      getServer().then((response) => {
        this.server = response.data;
        this.$modal.closeLoading();
      });
    },
    // 打开加载层
    openLoading() {
      this.$modal.loading("正在加载服务监控数据，请稍候！");
    },
  },
};
</script>
